<style lang="less" scoped>
@import "../../styles/common.less";
@import "./components/table.less";
</style>

<template>
    <div>
        <Row>
            <Card style="min-height: calc(100vh - 128px)">
                <div slot="title" style="display: flex; justify-content: space-between">
                    <Tabs value="all" style="margin-bottom: 0; max-width: calc(100% - 100px);" type="card">
                        <TabPane label="全部AP" name="all" icon="navicon"></TabPane>
                        <TabPane label="信道利用率Top10" name="channel"></TabPane>
                        <TabPane label="Noise Floor Top10" name="noise"></TabPane>
                        <TabPane label="Bootstraps Top10" name="bootst‎raps"></TabPane>
                        <TabPane label="Reboots Top10" name="reboots"></TabPane>
                        <TabPane label="终端 Top10"  name="device"></TabPane>
                        <TabPane label="流量 Top10" name="data"></TabPane>
                    </Tabs>
                    <div>
                        <Tooltip content="排序和过滤后的数据">
                            <Button type="primary" @click="exportData(2)"><Icon type="funnel"></Icon> </Button>
                        </Tooltip>
                        <Tooltip content="原始数据">
                            <Button type="primary"  @click="exportData(1)"><Icon type="ios-download"></Icon> </Button>
                        </Tooltip>
                    </div>
                </div>
                <Row>
                    <Col span="24">
                        <Table :columns="apColumns" :data="apData" size="small" ref="APtable"></Table>
                    </Col>
                </Row>
            </Card>
        </Row>
    </div>
</template>

<script>
import { apData, apColumns } from "./data/AP.js";
export default {
  name: "AC",
  data() {
    return {
      apColumns,
      apData,
      rowNum: apData.length,
      colNum: apColumns.length,
      csvFileName: "",
      excelFileName: "",
      tableExcel: {},
      fontSize: 16
    };
  },
  methods: {
    exportData(type) {
      if (type === 1) {
        this.$refs.APtable.exportCsv({
          filename: "原始数据"
        });
      } else if (type === 2) {
        this.$refs.APtable.exportCsv({
          filename: "排序和过滤后的数据",
          original: false
        });
      }
    }
  }
};
</script>

<style>

</style>
